<template>

  <div>
    <el-form ref="form"  label-width="80px" inline>
      <el-form-item label="顾客姓名">
        <el-input v-model="queryParam.customerName" placeholder="请输顾客姓名" ></el-input>
      </el-form-item>
      <el-form-item  >
        <el-button type="primary" size="mini" @click="search()">搜索</el-button>
      </el-form-item>
    </el-form>
    <el-button type="primary" @click="openCustomerFood()">添加顾客的膳食信息</el-button>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column align="center" type="index" label="序号" width="60"></el-table-column>
      <el-table-column prop="customer_name" label="顾客姓名" align="center"></el-table-column>
      <el-table-column prop="customer_sex" label="性别" align="center"></el-table-column>
      <el-table-column prop="customer_age" label="年龄" align="center"></el-table-column>
      <el-table-column prop="foodlike" label="平时喜好" align="center"></el-table-column>
      <el-table-column prop="foodattention" label="注意事项" align="center"></el-table-column>
      <el-table-column prop="foodlabel" label="备注" align="center"></el-table-column>
      <el-table-column label="操作" align="center">
        <template slot-scope="scope">
          <el-button type="waring" size="mini" @click="deleteById(scope.row.customer_food_id)">删除</el-button>
        </template>

      </el-table-column>
    </el-table>

    <div class="block">
      <span class="demonstration"></span>
      <el-pagination
          @size-change="queryList"
          @current-change="queryList"
          :current-page.sync="queryParam.current"
          :page-size.sync="queryParam.size"
          :page-sizes="[5,10,15,20,50]"
          layout="total,sizes, prev, pager, next"
          :total="total">
      </el-pagination>
    </div>


    <el-dialog :visible.sync="visible">
      <CustomerFoodEdit v-if="visible" @closeDialog="closeCustomerFood"></CustomerFoodEdit>
    </el-dialog>
  </div>


</template>

<script>
import CustomerFoodEdit  from "@/views/food_manage/customerFood/CustomerFoodEdit";
import service from "@/utils/request";
export default{
  components:{CustomerFoodEdit},
  data(){
    return {
      visible:false,
      tableData: [],
      loading: false,
      form: {
        customerId:'',
        customerName:'',
        customerAge:'',
        customerSex:'',
        roomNumber:'',
        buildingId:'',
        elderType:'',
        foodlike:'',
        foodremarks:'',
        checkinDate:'',
        foodattention:'',
        expirationDate:'',
        attention:'',
        psychosomaticState:'',
        height:'',
        maritalStatus:'',
        weight:'',
        bloodType:'',
        idcard:'',
        contactTel:'',
        birthday:'',

      },
      total:0,
      pages:0,
      queryParam: {
        current: 1,
        size: 5,
        customerName: '',
      }
    }
  },
  methods: {
    search() {
      this.queryParam.current = 1;
      this.queryList();
      console.log("------------------------", this.params)
    },
    queryList() {
      this.loading = true;
      service.post("/customerFood/list", this.queryParam).then((res) => {
        this.tableData = res.records;
        this.total = res.total;
        console.log("tableData:", this.tableData)
        console.log("total:", this.total)
        this.pages = res.pages;
        this.loading = false
      }).catch((error) => {
        // 添加错误处理逻辑
        console.error("An error occurred:", error);
        this.loading = false;
      });
    },
    openCustomerFood() {
      this.visible = true;
    },
    closeCustomerFood() {
      this.visible = false;
    },
    deleteById(id) {
      this.$confirm('是否删除', '确认信息').then(() => {
        service.get("/customerFood/removeById/" + id).then((res) => {
          const success = res
          if (success) {
            this.$message.success("删除成功");
            this.queryList();
          }
        })
      });
    },
  },
  created() {
    this.queryList()
  }
}


</script>

<style scoped>




</style>